<template>
  <div>
    <!-- 
    router-link会自动给当前的链接添加两个类名
    router-link-active: 激活的导航链接   模糊匹配
    router-link-exact-active:  激活的导航链接 精确匹配
    -->
    <router-link to="/find?xzz=小翟翟&age=20">发现音乐</router-link>&nbsp;
    <router-link to="/my/小杨程序员/400">我的音乐</router-link>&nbsp;
    <router-link to="/ftiend/黑马程序员/100">朋友</router-link>&nbsp;

    <div class="top">
      <router-view></router-view>
    </div>
  </div>
</template>

<script>
export default {


};
</script>

<style>
/* #app {
  display: flex;
  flex-direction: row;
  min-height: 100vh;
}
.mainContainer {
  display: flex;
  flex-direction: column;
  flex: 1;
} */

.exact {
  color: red;
}

.act {
  color: red;
}
</style>
